<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>小球滚动</title>
	<style type="text/css">
        body{
        	background: pink;
        }
        div{
        	width:100px;height: 100px;border-radius: 100%;background: #999;position: relative;animation:myfirist 5s linear 3s infinite alternate;-webkit-animation:myfirst 5s linear 3s infinite alternate;margin-top:900px;
        	    -webkit-box-shadow: 0 -1px 5px rgba(0,0,0,0.5);

        }

        @-webkit-keyframes myfirst{
        	0% {left:0;bottom:0;}
        	100%{left:100%;bottom:0;}
        }
	</style>
</head>
<body>


    <div></div>

	
</body>
</html>